<script setup lang="ts">
defineOptions({
  name: "credit",
});
</script>

<template>
  <div class="home-top-bg gap-4">
    <img
      src="/assets/images/logo/fenghuangwang.png"
      class="w-[60px] h-[60px]"
    />
    <img src="/assets/images/logo/logo.png" class="w-[60px] h-[60px]" />
    <div class="gradient-text text-4xl font-bold tracking-widest ml-2">
      联合凤凰网重磅推出
    </div>
  </div>
</template>

<style lang="scss" scoped>
.home-top-bg {
  @apply w-full h-[100px]  flex items-center justify-center;
  background: url("/assets/images/bg/home-top-bg.png") no-repeat;
}

.gradient-text {
  background-image: linear-gradient(to right, #ec3b00, #ff9442 50%, #ec3b00);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  display: inline-block;
  background-size: 200% auto;
  animation: gradient-flow 3s linear infinite alternate;
}
@keyframes gradient-flow {
  0% {
    background-position: 0% center;
  }
  100% {
    background-position: 100% center;
  }
}
</style>
